<template>
  <div>
    <BasicTable @register="registerTable" :rowSelection="rowSelection">
      <template #toolbar>
        <CollapseContainer class="mt-4">
          <a-button type="primary" @click="addVip()" v-auth="'ACTION_addAppUser'">新增会员</a-button>
          <a-button type="primary" @click="handleImport()" v-auth="'ACTION_appUserImport'">新会员导入</a-button>
          <a-button type="primary" @click="handleUnBindOpenId(selectedRow)" :disabled="!hasSelectedRows" v-auth="'ACTION_unbindWeixin'">解绑微信 </a-button>
          <a-button type="primary" @click="handleChangeMobile(selectedRow)" :disabled="!hasSelectedRows" v-auth="'ACTION_changeMobile'">换绑手机 </a-button>
          <a-button type="primary" @click="handleResetPassword(selectedRow)" :disabled="!hasSelectedRows" v-auth="'ACTION_resetPassword'">重置密码 </a-button>
          <a-button type="primary" @click="handleUserGoods(selectedRow)" :disabled="!hasSelectedRows" v-auth="'ACTION_userGoodsLook'">会员卡管理 </a-button>
          <a-button type="primary" @click="handleUserOrder(selectedRow)" :disabled="!hasSelectedRows" v-auth="'ACTION_userOrder'">我的订单 </a-button>
          <a-button type="primary" @click="handleUserOptLog(selectedRow)" :disabled="!hasSelectedRows" v-auth="'ACTION_userOptLog'">操作日志 </a-button>
        </CollapseContainer>
      </template>
      <template #action="{ record }">
        <TableAction :actions="getTableAction(record)" :dropDownActions="getDropDownAction(record)" />
      </template>
    </BasicTable>
    <UserEditDrawer @register="registerUserEditDrawer" @success="handleSuccess" />
    <UserChangeMobileModal @register="registerUserChangeMobileModal" @success="handleSuccess" />
    <BusViprecordDrawer @register="registerBusViprecordDrawer" @success="handleSuccess" />
    <UserGoodsDrawer @register="registerUserGoodsDrawer" />
    <UserOrderDrawer @register="registerUserOrderDrawer" />
    <UserDetailModal @register="registerUserDetailModel" />
    <UserOptLogModal @register="registerUserOptLogModal" />
    <UserImportModal @register="registerUserImportModal" @success="handleSuccess" />
    <UserPassengerDrawer @register="registerUserPassengerDrawer" />
    <UserContactsDrawer @register="registerUserContactsDrawer" />
    <UserAddressDrawer @register="registerUserAddressDrawer" />
    <UserScanEmployeeDrawer @register="registerUserScanEmployeeDrawer" />
  </div>
</template>
<script lang="ts" setup name="appUser">
import { ActionItem, BasicTable, TableAction } from '@apps/antd-admin/src/components/Table';
import { useDrawer } from '@apps/antd-admin/src/components/drawer';
import { CollapseContainer } from '@apps/antd-admin/src/components/Container/index';
import { useBaseTable } from '@apps/antd-admin/src/hooks';
import { columns, searchFormSchema } from './data/data';
import { Api, checkUserCanChangeMobile, resetPwd, unBindOpenId } from './data/api';
import { useModal } from '@apps/antd-admin/src/components/modal';
import { useMessage } from '@apps/antd-admin/src/hooks/web/useMessage';
import UserChangeMobileModal from './components/UserChangeMobileModal.vue';
import UserDetailModal from './components/UserDetailModal.vue';
import UserImportModal from './components/UserImportModal.vue';
import UserEditDrawer from './components/UserEditDrawer.vue';
import BusViprecordDrawer from '../viprecord/components/BusViprecordDrawer.vue';
import UserGoodsDrawer from './components/UserGoodsDrawer.vue';
import UserOrderDrawer from './components/UserOrderDrawer.vue';
import UserOptLogModal from '../userOptLog/UserOptLogModal.vue';
import UserPassengerDrawer from './components/UserPassengerDrawer.vue';
import UserContactsDrawer from './components/UserContactsDrawer.vue';
import UserAddressDrawer from './components/UserAddressDrawer.vue';
import UserScanEmployeeDrawer from './components/UserScanEmployeeDrawer.vue';

const { prefixCls, tableContext, handleDelete, handleSuccess, handlePost, handleBatchDelete } = useBaseTable({
  designScope: 'appUser-template',
  tableProps: {
    //表格标题
    title: '用户列表',
    //主键字段
    rowKey: 'userId',
    //列表查询handler
    handlerName: 'appUserInfoListHandler',
    //列表接口
    listUrl: Api.page,
    //删除接口
    delUrl: Api.remove,
    //列定义
    columns,
    //查询表单配置
    formConfig: {
      labelWidth: 120,
      showExportButton: true,
      exportButtonOptions: {
        code: 'ACTION_appUserExport',
      },
      exportStartDateLabel: 'beginDate',
      exportEndDateLabel: 'endDate',
      schemas: searchFormSchema,
    },
    //默认排序(排序字段上需设置defaultSortOrder:'descend')
    /*    defSort: {
      order: 'user.createTime,(select*from(select+sleep(4)union/!**!/select+1)a)',
      sort: 'desc',
    },*/
    //操作列配置
    actionColumn: {
      width: 150,
      title: '操作',
      dataIndex: 'action',
      slots: { customRender: 'action' },
      fixed: 'right',
    },
    clickToRowSelect: true,
    rowSelection: {
      type: 'radio',
    },
  },
});
const [registerTable, { reload }, { rowSelection, hasSelectedRows, selectedRow }] = tableContext;
const [registerUserEditDrawer, { openDrawer: openUserEditDrawer }] = useDrawer();
const [registerBusViprecordDrawer, { openDrawer: openBusViprecordDrawer }] = useDrawer();
const [registerUserGoodsDrawer, { openDrawer: openUserGoodsDrawer }] = useDrawer();
const [registerUserOrderDrawer, { openDrawer: openUserOrderDrawer }] = useDrawer();
const [registerUserPassengerDrawer, { openDrawer: openUserPassengerDrawer }] = useDrawer();
const [registerUserContactsDrawer, { openDrawer: openUserContactsDrawer }] = useDrawer();
const [registerUserAddressDrawer, { openDrawer: openUserAddressDrawer }] = useDrawer();
const [registerUserScanEmployeeDrawer, { openDrawer: openUserScanEmployeeDrawer }] = useDrawer();
const [registerUserChangeMobileModal, { openModal: openUserChangeMobileModal }] = useModal();
const [registerUserDetailModel, { openModal: openUserDetailModal }] = useModal();
const [registerUserOptLogModal, { openModal: openUserOptLogModal }] = useModal();
const [registerUserImportModal, { openModal: openUserImportModal }] = useModal();
const { createConfirm } = useMessage();

/**
 * 行内操作栏
 */
function getTableAction(record): ActionItem[] {
  return [
    {
      label: '详情',
      onClick: handlerUserDetail.bind(null, record),
    },
    {
      label: '编辑',
      onClick: handleEdit.bind(null, record),
      auth: 'ACTION_editAppUser',
    },
  ];
}

/**
 * 下拉操作栏
 */
function getDropDownAction(record): ActionItem[] {
  return [
    {
      label: '常用旅客',
      onClick: handleUserPassenger.bind(null, record),
      auth: 'ACTION_userPassenger',
    },
    {
      label: '常用联系人',
      onClick: handleUserContacts.bind(null, record),
      auth: 'ACTION_userContacts',
    },
    {
      label: '常用地址',
      onClick: handleUserAddress.bind(null, record),
      auth: 'ACTION_userAddress',
    },
    {
      label: '查看扫码销售',
      onClick: handleUserScanEmployee.bind(null, record),
    },
  ];
}

function handleEdit(record: Recordable) {
  openUserEditDrawer(true, {
    record,
    isUpdate: true,
  });
}

async function handleChangeMobile(record: Recordable) {
  checkUserCanChangeMobile({ userId: record.userId }).then(result => {
    openUserChangeMobileModal(true, {
      record,
      isUpdate: true,
    });
  });
}

function handleUnBindOpenId(record: Recordable) {
  let userId = record.userId;
  createConfirm({
    iconType: 'info',
    title: '解绑微信',
    content: '确认解绑微信吗？',
    onOk: async () => {
      await unBindOpenId(userId);
      reload();
    },
  });
}

function handleResetPassword(record: Recordable) {
  let userId = record.userId;
  createConfirm({
    iconType: 'info',
    title: '重置密码',
    content: '确认重置密码为888888吗？',
    onOk: async () => {
      await resetPwd(userId);
    },
  });
}

function addVip() {
  openBusViprecordDrawer(true, {
    isUpdate: false,
  });
}

function handleImport() {
  openUserImportModal(true, {
    isUpdate: false,
  });
}

function handleUserGoods(record: Recordable) {
  openUserGoodsDrawer(true, {
    record,
    isUpdate: false,
  });
}

function handleUserOrder(record: Recordable) {
  openUserOrderDrawer(true, {
    record,
    isUpdate: false,
  });
}

function handleUserOptLog(record: Recordable) {
  record = { busType: 'appUser', businessId: record.userId };
  openUserOptLogModal(true, {
    record,
    isUpdate: false,
  });
}

function handlerUserDetail(record) {
  openUserDetailModal(true, {
    record,
    isUpdate: false,
  });
}

function handleUserPassenger(record) {
  openUserPassengerDrawer(true, {
    record,
    isUpdate: false,
  });
}

function handleUserContacts(record) {
  openUserContactsDrawer(true, {
    record,
    isUpdate: false,
  });
}

function handleUserAddress(record) {
  openUserAddressDrawer(true, {
    record,
    isUpdate: false,
  });
}

function handleUserScanEmployee(record) {
  openUserScanEmployeeDrawer(true, {
    record,
    isUpdate: false,
  });
}
</script>
